<template>
<div class="ListView">
    <list-view-top :playlist="listmenu.playlist"></list-view-top>
    <play-list></play-list>
</div>
</template>

<script>
// import { getPlayListDetail } from "../api"
import { onMounted,reactive ,provide} from "vue"
import { useRoute } from "vue-router"
import ListViewTop from "../components/ListViewTop.vue"
import PlayList from "../components/PlayList.vue"
import axios from "axios"
export default {
    components:{ListViewTop,PlayList},
    setup(){
        const route=useRoute()
        let listmenu = reactive({list:[],playlist:{}})

        onMounted(()=>{
            //通过route获取歌单id
            let id = route.query.id;
            console.log(axios.get)
            axios.get(`/api/playlist?id=${id}`, {
                //   user: "12345",
                //   password: "12345",
                })
                .then(function(res) {
                  console.log(res)
                  console.log("我运行了")
                })
                .catch(function(error) {
                  console.log(error);
                  console.log("我tama运行了")
                });
            // let result = getPlayListDetail(id).then((res)=>{
            //     listmenu.playlist=res.data.playlists;
            //     console.log(listmenu.playlist)
            // });
        })

        // let playlist = reactive({playlist})
        // provide('playlist',listmenu.playlist)

        return{
            listmenu
        }
    }
}
</script>